{% extends "base.html" %}

{% load i18n %}

{% block mainContent %}
    <div class="main-container col1-layout">
        <div class="main">
            <div class="col-main">
                <div class="account-create">
                    <div class="page-title"> <h1>Create an Account</h1> </div>
                    <form action="/accounts/register/" method="post" id="form-validate">
                        {% csrf_token %}
                        <div class="fieldset">
                            <input type="hidden" name="success_url" value="">
                            <input type="hidden" name="error_url" value="">
                            <h2 class="legend">Personal Information</h2>
                            <ul class="form-list">
                                <li class="fields">
                                    <div class="customer-name">
                                        <div class="field name-id_username">
                                            <label for="id_username" class="required"><em>*</em>User Name</label>
                                            <div class="input-box">
                                                <input type="text" id="id_username" name="username" value="" title="User Name" class="input-text required-entry">
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                <li>
                                    <label for="id_email" class="required"><em>*</em>Email Address</label>
                                    <div class="input-box">
                                        <input type="text" name="email" id="id_email" value="" title="Email Address" class="input-text validate-email required-entry">
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="fieldset">
                            <h2 class="legend">Login Information</h2>
                            <ul class="form-list">
                                <li class="fields">
                                    <div class="field">
                                        <label for="id_password1" class="required"><em>*</em>Password</label>
                                        <div class="input-box">
                                            <input type="password" name="password1" id="id_password1" title="Password" class="input-text required-entry validate-password">
                                        </div>
                                    </div>
                                    <div class="field">
                                        <label for="id_password2" class="required"><em>*</em>Confirm Password</label>
                                        <div class="input-box">
                                            <input type="password" name="password2" title="Confirm Password" id="id_password2" class="input-text required-entry validate-cpassword">
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="buttons-set">
                            <p class="required">* Required Fields</p>
                            <p class="back-link"><a href="http://www.emthemes.com/demo/magento-theme-perfume-store-em0008/index.php/customer/account/login/" class="back-link"><small>« </small>Back</a></p>
                            <button type="submit" title="Submit" value="{% trans 'Submit' %}" class="button"><span><span>Submit</span></span></button>
                        </div>
                    </form>
                    <script type="text/javascript">
                        //<![CDATA[
                        var dataForm = new VarienForm('form-validate', true);
                        //]]>
                    </script>
                </div>
            </div>
        </div>
    </div>
{% endblock %}